<template>
  <div>
      <ul>
          <li v-for='(i,index) in list' :key="index">{{i.name}}
            <router-link :to="{'name':'setparams',query:{id:i.id}}">参数配置</router-link>
          </li>
      </ul>



      <table>
          <tr v-for='(i,index) in list' :key="i.id">
            <td><van-field :label='i.label'/></td>
            <td>
                <select v-model="typevalues[index]">
                    <option value="input">输入框</option>
                    <option value="radio">单选框</option>
                    <option value="select">多选框</option>
                    <option value="input">下拉框</option>
                    <option value="datetime">日期</option>
                    <option value="file">文件</option>

                </select>
            </td>
          </tr>

          <tr>
            <td>
                <van-field label='值' v-model='values[index]'/>
                <vam-button @click="getsource(index)">选择数据源</vam-button>
            </td>
          </tr>
      </table>
      <vam-button @click="add">+</vam-button>
      <van-button @click="submit">提交</van-button>



       <el-dialog v-model="dialogTableVisible" title="Shipping address">
            <el-table
            ref="singleTable"
            :data="tableData"
            highlight-current-row
            style="width: 100%"
            @current-change="handleCurrentChange"
          >
            <el-table-column type="index" width="50" />
           
            <el-table-column property="name" label="Name" width="120" />
           
          </el-table>
         
          </el-dialog>

      
  </div>
</template>

<script>
export default {
data(){
    return{
        list:[{'label':'名称'}],
        names:{},
        typevalues:{},
        values:{},
        dialogTableVisible:false,
        gridData:[{'id':1,'name':'请假类型数据源'},{'id':2,'name':'会议地址数据源'}],
        tableData: [],
        id:this.$route.query.id
    }
},
methods:{
    add(){
        this.list.push({'label':'名称'})


    },
    submit(){
        //获取输入的所有值
        let tlist=[]
        for(var i=0;i<this.list.length;i++){
            alert('0')
            let dict={'lable':this.names[i],'type':this.typevalues[i],
            'values':this.values([i])}
            tlist.push(dict)
        }
        console.log(tlist)
    },
    //添加数据源
    getsource(index){
            localStorage.setItem('index',index)
            this.axios('getresourcedata','get').then(res=>{
                this.tableData = res.list
            })
            this.dialogTableVisible=true
        },
    handleCurrentChange(val) {
        this.dialogTableVisible=false
        let index = localStorage.getItem('index')
        this.values[index] = JSON.stringify(val['mes'])
        
    }
}
}
</script>

<style>

</style>